<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="/./css/bootstrap.min.css">
  <link rel="stylesheet" href="/./css/base.css">
  <link rel="stylesheet" href="/./css/flex.css">
  <link rel="stylesheet" href="/./style/login.css">
  <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
  <title>登录</title>
</head>

<body>
  <header>
    <div class="container disFlex jBetween login_header">
      <div class="login_logo">
        <a href="http://www.jd.com/" clstag="pageclick|keycount|20150112ABD|45">
          <img src="http://misc.360buyimg.com/lib/img/e/logo-201305-b.png" alt="京东" width="170" height="60">
        </a>
        <img src="https://misc.360buyimg.com/user/passport/1.0.0/css/i/l-icon.png" alt="">
      </div>
      <div class="login_ask">
        <a href="http://surveys.jd.com/index.php?r=survey/index/sid/568245/lang/zh-Hans" target="_blank" class="q-link">
            <img src="https://misc.360buyimg.com/user/passport/1.0.0/css/i/q-icon.png" alt="">
            登录页面，调查问卷
          </a>
      </div>

    </div>
    <div class=" container-fluid login_tip">
      <div class=" container">
        <i class="icon"><img src="https://misc.360buyimg.com/user/passport/1.0.0/widget/login-form-2016-1124/i/icon-tips.png" alt=""></i>
        <span>依据《网络安全法》，为保障您的账户安全和正常使用，请尽快完成手机号验证！ 新版<a href="https://about.jd.com/privacy/" target="_blank">《京东隐私政策》</a>已上线，将更有利于保护您的个人隐私。</span>
      </div>
    </div>
  </header>
  <main>
    <div class="container-fluid login_body">
      <div class="login_bg">
        <div class="login_form_container">
          <div class=" disFlex jBetween container-fluid login_form_mod">
            <a data-target="smdl">扫码登录</a>
            <i>|</i>
            <a class="active" data-target="zhdl">账户登录</a>
          </div>
          <div class="login_form_block">
            <div class="login_form_item" id='smdl'>
              <div class="sm_body">
                <div class="sm_ewm">
                  <img src="https://qr.m.jd.com/show?appid=133&size=147&t=1506334806590" class="ewm" alt="">
                  <img src="https://misc.360buyimg.com/user/passport/1.0.0/css/i/phone-orange.png" class="sao" alt="">
                </div>
                <div class="sm_tip">
                  打开 <a href="http://app.jd.com/">手机京东</a> 扫描二维码
                </div>
                <div class="sm_more">
                  <span><i class="i_mian"></i>免输入&#x3000;</span>
                  <span><i class="i_fast"></i>更快&#x3000;</span>
                  <span><i class="i_save"></i>更安全&#x3000;</span>
                </div>
              </div>
            </div>
            <div class="login_form_item active" id='zhdl'>
              <div class="login_form_Body">
                <div class="input-group">
                  <span class="input-group-addon" id="aUName"><i class="glyphicon glyphicon-user"></i></span>
                  <input type="text" class="form-control" placeholder="用户名" aria-describedby="aUName">
                </div>
                <br>
                <div class="input-group">
                  <span class="input-group-addon" id="aPW"><i class="glyphicon glyphicon-lock"></i></span>
                  <input type="password" class="form-control" placeholder="密码" aria-describedby="aPW">
                </div>
                <br>
                <div class="login_forget"><a href="#">忘记密码</a></div>
                <br>
                <button type="button" class="btn btn-danger login_submit">登录</button>
              </div>

            </div>
          </div>
          <div class="login_footer disFlex jBetween">
            <div class="Q_W"><span><i class="i_QQ"></i>QQ</span><span><i class="i_WX"></i>微信</span></div>
            <div class="reg"><a href="/api/register"><i class="i_lg"></i>立即注册</a></div>
          </div>
        </div>
      </div>
    </div>
  </main>
  <footer>
    <div class="login_footer">
      <div class="login_links">
        <a rel="nofollow" target="_blank" href="//www.jd.com/intro/about.aspx">关于我们</a> |
        <a rel="nofollow" target="_blank" href="//www.jd.com/contact/">联系我们</a> |
        <a rel="nofollow" target="_blank" href="//zhaopin.jd.com/">人才招聘</a> |
        <a rel="nofollow" target="_blank" href="//www.jd.com/contact/joinin.aspx">商家入驻</a> |
        <a rel="nofollow" target="_blank" href="//www.jd.com/intro/service.aspx">广告服务</a> |
        <a rel="nofollow" target="_blank" href="//app.jd.com/">手机京东</a> |
        <a target="_blank" href="//club.jd.com/links.aspx">友情链接</a> |
        <a target="_blank" href="//media.jd.com/">销售联盟</a> |
        <a href="//club.jd.com/" target="_blank">京东社区</a> |
        <a href="//gongyi.jd.com" target="_blank">京东公益</a> |
        <a target="_blank" href="//en.jd.com/" clstag="pageclick|keycount|20150112ABD|9">English Site</a>
      </div>
      <div class="copyright">
        Copyright&nbsp;©&nbsp;2004-2017&nbsp;&nbsp;京东JD.com&nbsp;版权所有
      </div>
    </div>
  </footer>
  <script src="/./js/bootstrap.min.js"></script>
  <script>
    $('.login_form_mod a').click(function () {
      var tag = this.dataset.target;
      $(this).addClass('active').siblings('a').removeClass('active');
      $(`#${tag}`).addClass('active').siblings().removeClass('active');
    })
    $('button').click(function (e) {
      var user = $('input:text').val();
      var psw = $('input:password').val();
      $.get('/api/login/user?user=' + user + '&psw=' + psw + '', (data) => {
        alert(data.message);
        if (data.code == 'success') {
          location.href = '/'
        }
      })
    })
  </script>
</body>

</html>